<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <!-- PAGE TITLE -->
    <title>Page Name -Juntos - Charity & Association Template</title>
    <!-- MAKE IT RESPONSIVE -->
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <!-- BOOTSTRAP -->
    <link href="css/bootstrap.min.css" rel="stylesheet" media="screen">
    <!-- COLORS -->
    <link href="css/color-sheme-1.css" rel="stylesheet" media="screen">
    <style type="text/css">
    	/* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * *
		* * COLOR SHEME 1 #0DB4E9 (blue) #82b440 (green)
		* * COLOR SHEME 2 #6BD6D6 #D66B6B
		* * COLOR SHEME 3 #B782ED #B8ED82
		* * COLOR SHEME 4 #917B54 #F7A516
		* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * */
		.colored, 
		a:hover,
		.event a, 
		.post a,
		.section-content-colored .section-content .event-content a.btn:hover,
		.section-content-colored .section-content .post-content a.btn:hover,
		.section-full-colored,
		.section a.btn:hover{
			color: #82b440;
		}
		.section-content-colored .section-content .event-content a.btn:hover,
		.section-content-colored .section-content .post-content a.btn:hover,
		.section a.btn:hover,
		.section-image a.btn.btn-donation,
		#menu a.btn-success{
			border-color: #82b440;
		}
		.section-full-colored,
		.section-content-colored .section-content,
		.section a.btn,
		.section-full-colored .section-content,
		.section-content-colored .section-content .event-content a.btn,
		.section-content-colored .section-content .post-content a.btn,
		.section-image a.btn.btn-donation,
		#single-page .section-header,
		#menu a.btn-success{
			background-color: #82b440;
		}
		.section-content-colored.with-arrow:after,
		.section-full-colored.with-arrow:after{
			border-top-color: #82b440;
		}
		a,
		.section-content-colored.color2 .section-content .event-content a.btn:hover,
		.section-content-colored.color2 .section-content .post-content a.btn:hover{
			color: #0DB4E9;
		}
		.is-sticky #navigation, 
		.mean-container .mean-nav ul,
		.pace .pace-progress{
			background-color: #0DB4E9;
		}
		.pace .pace-progress-inner {
		  box-shadow: 0 0 10px #0DB4E9, 0 0 5px #0DB4E9;
		}
		.pace .pace-activity {
		  border-top-color: #0DB4E9;
		  border-left-color: #0DB4E9;
		}
		.section-content-colored.color2 .section-content .event-content a.btn,
		.section-content-colored.color2 .section-content .post-content a.btn,
		.section-content-colored.color2 .section-content{
			background-color: #0DB4E9;
		}
		.section-content-colored.color2 .event-content a.btn:hover,
		.section-content-colored.color2 .post-content a.btn:hover{
			border-color: #0DB4E9;
		}
		.section-content-colored.color2.with-arrow:after,
		.section-full-colored.color2.with-arrow:after{
			border-top-color: #0DB4E9;
		}
   </style>
    <!-- MAIN STYLE -->
    <link href="style.css" rel="stylesheet" media="screen">
    <!-- FONTS -->
    <link href='http://fonts.googleapis.com/css?family=Lato:300,400,700' rel='stylesheet' type='text/css'>
    <link href='http://fonts.googleapis.com/css?family=Varela+Round' rel='stylesheet' type='text/css'>
    <!-- HTML5 shim and Respond.js IE8 support of HTML5 elements and media queries -->
    <!--[if lt IE 9]>
      <script src="js/html5shiv.js"></script>
      <script src="js/respond.min.js"></script>
    <![endif]-->
  </head>
  <!-- START BODY -->
  <body>
	<div id="page">
		<!-- START MAIN CONTAINER -->
		<div id="main-container">
		
			<!-- START NAVIGATION -->
			<nav id="navigation">
				<div class="container">
					<!-- LOGO GOES HERE -->
					<a href="index.html" id="logo"><img src="images/logo.png" alt="Logo Image"></a>
					<!-- MENU -->
					<nav>
						<ul id="menu">
							<li><a href="index.html#project">Project</a></li>
							<li><a href="index.html#team">Team</a></li>
							<li><a href="index.html#services">Services</a></li>
							<li><a href="index.html#gallery">Gallery</a></li>
							<li><a href="index.html#events">Events</a></li>
							<li><a href="index.html#blog">Blog</a></li>
							<li><a href="index.html#contact">Contact</a></li>
							<li><a href="index.html#donation" class="btn btn-success">Donation</a></li>
						</ul>
					</nav>
				</div>
			</nav>
			<!-- END NAVIGATION -->
		
			<!-- START PAGE SECTION -->
			<section id="single-page" class="section with-arrow">
				<!-- SECTION TITLE -->
				<div class="section-header">
					<div class="container">
						<h1>Page Title</h1>
					</div>
				</div>
				<!-- SECTION CONTENT -->
				<div class="section-content">
					<div class="container">
						<p>Page Content, right here...</p>
					</div>
				</div>
			</section>
			<!-- END TEAM SECTION -->
			
			<!-- START FOOTER SECTION -->
			<section id="footer" class="section section-full-colored">
				<div class="section-content center">
					<p>Juntos - Design & Development by <a href="#">2F</a></p>
				</div>
			</section>
			<!-- END FOOTER SECTION -->
		
		</div>
		<!-- END MAIN CONTAINER -->
		
		<!-- PAGE LOADING-->
		<div id="loader"></div>
  	</div>
    <!-- SCRIPTS -->
    <script src="http://code.jquery.com/jquery.js"></script>
	<script src="js/alert.js"></script>
	<script src="js/jquery.sequence-min.js"></script>
    <script src="js/jquery.fancybox.pack.js"></script>
    <script src="js/jquery.sticky.js"></script>
    <script src="js/jquery.scrollUp.min.js"></script>
    <script src="js/jquery.smoothscroll.min.js"></script>
    <script src="js/jquery.meanmenu.min.js"></script>
    <script src="js/pace.min.js"></script>
    <script src="js/jquery.flexslider-min.js"></script>
    <script src="js/custom.js"></script>
  </body>
  <!-- END BODY -->
</html>